import './imports.js';

import Header from '../components/Header';
import NewsList from '../components/NewsList/index.js';
import NoDataTip from '../components/NoDataTip/index.js';



;((doc) => {
    const oApp = doc.querySelector('#app');
    const collectorDataList = JSON.parse(localStorage.getItem('collectorDataList') || "[]" );
    let oListWrapper = null;

    const init = () => {
        render();
        bindEvent();
    };


    function render(){
        const headerTpl = Header.tpl({
            url: '/',
            title: '我的新闻',
            showLeftIcon: true,
            showRightIcon: false
        })
        
        if(collectorDataList.length){
            const listWrapper = NewsList.wrapper(4.4);
            oApp.innerHTML += ( headerTpl + listWrapper );

            oListWrapper = document.querySelector('.new-list');
            renderList(collectorDataList);
        }else{
            oApp.innerHTML += (headerTpl + NoDataTip.tpl());
        }

    };

    function bindEvent(){
        collectorDataList.length && NewsList.bindEvent(oListWrapper, setCurrentNews)
    }


    function renderList(data){
        const newsListTpl = NewsList.tpl({
            data: data,
            pageNum: -1
        });

        oListWrapper.innerHTML = newsListTpl;
        NewsList.imgShow()
    }

    function setCurrentNews(options){
        const { idx } = options;
        console.log(idx);
        const currentNews = collectorDataList[idx];

        localStorage.setItem('currentNews',JSON.stringify(currentNews));
    }

    init();
})(document);